const path = require('path')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const ESLintPlugin = require('eslint-webpack-plugin')
const CopyWebpackPlugin = require("copy-webpack-plugin")
module.exports ={
    //入口文件 绝对路径
    entry:path.resolve(__dirname,'../src/index.js'),
    //出口文件 绝对路径
    output:{
        path:path.resolve(__dirname,"../bulid"),
        filename:"index.js"
    },
    //打包模式
    mode:'production',
    //配置loader 用于解决非javascript文件
    module:{
        rules:[
            {
                //处理css的loader
                test: /\.css$/i,
                use: [
                    //use中loader加载是有顺序的，先下后上，注意有的loader需要按照顺序书写
                    MiniCssExtractPlugin.loader,
                    'css-loader'
                ]
            },{
                //处理less的loader
                test: /\.less$/i,
                use: [
                    //use中loader加载是有顺序的，先下后上，注意有的loader需要按照顺序书写
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'less-loader'
                ]
            },{
                test: /\.(webp)$/,
                //asset 在导出一个 data URI 和发送一个单独的文件之间自动选择。代替之前的url-loader和file-loader
                type: "asset",
                parser: {
                    dataUrlCondition: {
                        maxSize: 10 * 1024, // 小于10kb以下的图片会被打包成base64格式
                    },
                },
                generator: {
                    filename: 'images/[name][ext]'
                }
            }

        ]
        
        
    },
    //配置插件实现loader其他功能
    plugins:
        [
            new MiniCssExtractPlugin({
                //输出独立文件的文件名
                filename: 'css/[name].css'
            }),
            //打包html
            new HtmlWebpackPlugin({
                //以什么为模板
                template: "./public/index.html",
                //相对与出口路径的
                filename: "index.html",              
                //html压缩对应的要求
                minify: {
                    collapseWhitespace: true,
                    keepClosingSlash: true,
                    removeComments: true,
                    removeRedundantAttributes: true,
                    removeScriptTypeAttributes: true,
                    removeStyleLinkTypeAttributes: true,
                    useShortDoctype: true
                }
            }),
            //js格式校验
            new ESLintPlugin({
                //自动校验
                fix:true
            }),
            //打包公共文件
            new CopyWebpackPlugin({
                patterns: [{
                    //相对入口路径
                    from: "./public",
                    to: "public",
                    //配置忽略文件
                    globOptions: {
                        ignore: ["**/index.html"]
                      }
                    
                }],
            }),


        ],
    //css 解压文件
    optimization: {
        minimizer: [
            new CssMinimizerPlugin(),
        ],
        minimize: true,
    },
    

}